<template>
    <div id="news">
        news
        <ul class="allNews">
            <li class="item" v-for="newsItem in myData_news">
                <div class="picBox">
                
                    <img v-lazy="'http://localhost:3000/'+newsItem.picture" alt='newsPicture'/>
                </div>
                <div class="textBox">
                    <h3>{{newsItem.title}}</h3>
                    <p>{{newsItem.content}}</p>
                </div>
            </li>
        </ul>
    </div>
</template>
<script>
import "./news.css";
import {mapMutations,mapGetters,mapActions} from "vuex";
export default {
    data(){
        return{
            // dataNews:this.myData_news
        }
    },
    methods:{
        ...mapMutations(["changeCurMode"]),
        ...mapActions(["reqNews"]),
        showData(){
            console.log(this.myData_news);
        }
    },
    computed:{ 
      ...mapGetters(["myData_news","myCurMode"])
    },
    created(){
        this.changeCurMode('新闻');
        console.log("created");
        this.reqNews();
    },
    beforeMount(){
        console.log("beforeMount");
        
    }
}
</script>